<template>
    <link type="text/css" rel="stylesheet" href="/assets/css/style.css">
    <link rel="stylesheet" href="/assets/css/kickback.css">
    <div class="kickback_header">
        <div class="left">
            <div>可提现(元): <span>{{ outstanding }}</span></div>
            <div>累计提现(元): <span>{{ settled }}</span></div>
        </div>
        <div class="right">
            立即提现
        </div>
    </div>
    <div class="kickback">
        <li v-for="(item, index) in list" :key="index">
            <div class="item">
                <div class="left">
                    <div class="img">
                        <img :src="item.avatar" alt="">
                    </div>
                    <div class="content">
                        <div class="nickname">订单号：{{item.code}}</div>
                        <div class="tel">商品名称：{{item.name}}</div>
                    </div>
                </div>
                <div class="right">
                    <div class="status">{{item.status}}</div>
                    <div class="money">+{{item.money}}</div>
                </div>
            </div>
        </li>
    </div>
</template>

<script setup>
    const {proxy} = getCurrentInstance()

    let business = proxy.$business

    proxy.$business.value.outstanding = 40

    //佣金订单列表
    let list = reactive([])
    let outstanding = 0
    let settled = 0

    //当页面一加载进来的时候就触发的挂载前生命周期钩子函数
    onBeforeMount(()=>{
        KicbackList()
    })

    const KicbackList = async () =>
    {
        //发起请求
        var result = await proxy.$POST({
            url: '/team/commission',
            params: {
                busid: proxy.$business.value.id
            }
        })

        //要么是出错 要么没有数据
        if(result.code == 0)
        {
            proxy.$fail(result.msg)
            return false
        }

        result.data.map((item)=>{
            //重组分销会员结构
            list.push({
                name: item.subject,
                avatar: item.avatar,
                code: item.order.code,
                money: item.amount,
                status: item.status == '1' ? '已结算' : '未结算'
            })

            if(item.status == 0)
            {
                outstanding += parseInt(item.amount)
            }else
            {
                settled +=parseInt(item.amount)
            }
        })

        outstanding = outstanding.toFixed(2)
        settled = settled.toFixed(2)
    }
</script>